<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport"
	content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name='format-detection' content='telephone=no' />
<title>人车人</title><link rel="icon" href="/assets/img/titleico.ico" type="image/x-icon">
<link rel="stylesheet" href="/assets/css/common.css" />
<link rel="stylesheet" href="/assets/css/iconfont/iconfont.css" />
<style>
body {
	background-color: #fff;
}

section {
	background-color: #fff;
	padding-bottom: 6rem;
}

#uploadpage .container {
	padding: 0;
}

section .container .list li.input {
	background-color: #fff;
	padding: .6rem 0;
}

section .container .list li.input .icon {
	padding: 4px;
	border-radius: 6px;
	margin-right: 3%;
}

section .container .list li.input i {
	color: #c7c7c7;
	font-size: 2.2rem;
	transform-origin: 10px;
}

section .container .list li.input .info .posbor {
	position: absolute;
	width: 100%;
	bottom: 0;
}

section .container .list li.input .info i {
	font-size: 2rem;
	display: none;
	opacity: 1;
}

section .container .list li.input i.fail {
	color: #fd0421;
	opacity: 0;
}

section .container .list li.input i.success {
	color: #5cb85c;
	display: none;
}

section .container .list li.input label {
	padding: 2% 5%;
	width: 90%;
	align-items: center;
}

#uploadpage .container .list li.input label span {
	font-size: 1.4rem;
	padding: 0;
	padding-right: .8rem;
}

section .container .list li.input label input {
	color: #a7a7a7;
	width: 100%;
	font-size: 1.4rem;
}

section .container .list li.input label input[type=date] {
	color: #333;
}

section .container .list li.input label select {
	font-size: 1.6rem;
}

section .container .subbtn a {
	display: block;
	padding: 3% 0;
	width: 90%;
	text-align: center;
	margin: 3% auto;
	border-radius: 6px;
	background-color: #5cb85c;
	color: #fff;
}

section .container .subbtn a:active {
	background-color: #59ab59;
}

section .container p.title {
	padding: .4rem 2rem;
	background-color: #eaeaea;
}

section .container .info {
	padding: 1.4rem 0;
}

section .container .info div.flex {
	text-align: center;
}

section .container .info div.flex div {
	line-height: 2rem;
}

section .container .list li {
	padding: 1.5rem 5%;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	font-size: 1.4rem;
	-webkit-align-items: center;
	align-items: center;
	position: relative;
}

section .container .list li a {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
}

section .container .list li i.iconfont {
	font-size: 2rem;
}

section .container .list li i.new {
	font-size: 1.8rem;
	color: #f00;
	position: absolute;
	top: 0;
	left: 0;
}

section .container .list li div {
	text-align: center;
}

section .container .out {
	display: block;
	margin: 1rem auto;
	width: 90%;
	height: 2.8 rem;
	line-height: 2.8rem;
	text-align: center;
	background-color: #fff;
	border-radius: 99px;
	border: 1px solid #007aff;
	color: #007aff;
}

section .container .list li p.name {
	width: 5rem;
}

section .container .nolist {
	display: none;
	text-align: center;
	margin-top: 24%;
}

a.add,a.perfectmsg {
	display: block;
	padding: 3% 0;
	width: 90%;
	text-align: center;
	margin: 3% auto;
	border-radius: 6px;
	background-color: #5cb85c;
	color: #fff;
}

::-webkit-input-placeholder {
	color: #fd0421;
}

.fliebox ul li .title {
	padding: 2% 5%;
	width: 90%;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: space-between;
	justify-content: space-between;
}

.fliebox ul li .upbox {
	-webkit-align-items: center;
	align-items: center;
	-webkit-flex-flow: column;
	flex-flow: column;
	text-align: center;
}

.fliebox ul li .upbox .uplabel {
	position: relative;
	padding: 2%;
	width: 40%;
	border: 1px dashed #007aff;
	overflow: hidden;
	height: 10rem;
}

.fliebox ul li .upbox .uplabel .showimg {
	position: absolute;
	width: 96%;
	height: 96%;
	top: 2%;
	left: 2%;
	background-color: #fff;
	display: none;
}

.fliebox ul li .upbox .uplabel .showimg img {
	-webkit-filter: blur(3px);
	filter: blur(3px);
	position: relative;
	top: 0;
	left: 0;
}

.fliebox ul li .upbox .uplabel .hide {
	display: none;
}

.fliebox ul li .upbox .uplabel .loadingbox {
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 3;
	align-items: center;
	justify-content: center;
	top: 0;
	left: 0;
}

.fliebox ul li .upbox .uplabel .loadingbox .loading {
	width: 3rem;
	height: 3rem;
	border-top: .4rem solid rgba(0, 0, 0, 0.2);
	border-right: .4rem solid rgba(0, 0, 0, 0.2);
	border-bottom: .4rem solid rgba(0, 0, 0, 0.2);
	border-left: .4rem solid #ffffff;
	border-radius: 50%;
}

.fliebox ul li .upbox .uplabel i {
	font-size: 6.6rem;
}

.fliebox ul li .upbox .uplabel .up {
	padding-bottom: .8rem;
}

.fliebox ul li .upbox .uplabel input {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	opacity: 0;
	z-index: 2;
}

.fliebox ul li .imagename {
	padding: .6rem;
	line-height: 1.8rem;
	text-align: center;
}

.fliebox ul li .imagename span {
	color: #606060;
	font-size: 1.6rem;
}

.fliebox ul li .imagename a {
	display: none;
	padding: .4rem 1rem;
}

.fliebox ul li .imagename a i {
	vertical-align: middle;
	color: #fd0421;
}

.fliebox ul li .upbox .uplabel .animation {
	-webkit-animation: loading 1s infinite linear;
	animation: loading 1s infinite linear;
}
</style>
<script src="/assets/js/jquery-3.1.1.min.js"></script>
</head>
<body>
	#@tabHead("贷后管理",false) #@loadContainer()
	<div id="show-template" class="show-template trans">
		<div class="loading"></div>
		<img src="" />
	</div>
	<section id="uploadpage" class="visiblecon sectrans">
		<div class="container">
			<div class="orderlist">
				<ul class="list" id="ulcon">

				</ul>
			</div>
			<img src="/assets/img/express.png" width="100%" />
		</div>
	</section>

	<!-- footer start -->
	#--#@footer(2)--#
	<!-- end footer -->

	<script src="/assets/js/fastclick.min.js"></script>
	<script src="/assets/js/xxsg.js"></script>
	<script src="/assets/js/exif.min.js"></script>
	<script id="mainjs">
    	$(function(){
    		var section = $("#uploadpage"),
    			ulDom = $("#ulcon"),
    			bodyDom = document.body;//用于窗口滚动
    		$.ajax({
    			type:"post",
    			url:"/afterLoan/getInfo",
    			success:function(data){
    				console.log(data)
    				var lastData = data.splice(data.length - 1)[0];
    				getBaseTab(lastData);
    				console.log(lastData)
    				showSuc();
    			}
    		})
    		
    		function getBaseTab(data){
    			var html = "";
    			if(data.value){
					html = "<li class='flexbox b_bor'>"+
	        		   	   "	<p>"+ data.expl +"："+ data.value +"</p>"+
	        		   	   "</li>";
				}else{
					html = "<li class='b_bor input'>"+
	           	    	   "    <label class='flexbox'>"+
	                	   "        <div class='icon'>"+
	                	   "            <i class='iconfont fail'>&#xe602;</i>"+
	                	   "            <i class='iconfont success'>&#xe641;</i>"+
	                	   "        </div>"+
	               	       "        <span>"+ data.expl +":</span>"+
	               	       "		<input class='flex empty' type='text' id="+ data.paramterName +" name="+ data.paramterName +" />"
	                	   "	  </label>"+		
	                	   "</li>";
				}
    			ulDom.append(html);
    			ulDom.parent().append("<a class='subbtn'>提交</a>");
			}
			
    		ulDom.on("blur",".empty",function(){
				isNotEmpty($(this))
			});
			
    		section.on("click",".subbtn",function(){
    			if($("#courierNo").length <= 0){
    				_x.showTip("提交成功！",{url: "/afterLoan/afterLoan"});
    				return;
    			}
				if(isNotEmpty($("#courierNo"))){
					$.getJSON("/afterLoan/submit",{courierNo:$("#courierNo").val()},function(data){
						if(data.code == "1"){
							_x.showTip(data.msg,{url: "/afterLoan/afterLoan"});
						}else{
							_x.showTip("提交失败！");
						}
					})
				}
			});
			
			function isNotEmpty(input){
				var iconDom = input.siblings(".icon");
				if(_x.isEmpty(input.val())){
					iconDom.children(".success").hide().siblings(".fail").show().css("opacity",1);
					input.attr("placeholder","此项不能为空！");
					return false;
				}
				
				if(input.attr("name") == "phone"){
					if(input.val().length != 11 || /[^0-9]/.test(input.val())){
						iconDom.children(".success").hide().siblings(".fail").show().css("opacity",1);
						input.attr("placeholder","手机号码无效！");
						return false;
					}
				}
				
				if(input.attr("name") == "idNo"){
					if(!/(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(input.val())){
						iconDom.children(".success").hide().siblings(".fail").show().css("opacity",1);
						input.attr("placeholder","身份证号码无效！");
						return false;
					}
				}
				iconDom.children(".fail").hide().siblings(".success").show();
				return true;
			};
    		
    		function showSuc(){
    			$("#uploadpage").removeClass("visiblecon");
    			$("#load-container").removeClass("load7");
        	}
    	})
    </script>
</body>
</html>